<mat-nav-list>
  <h3 mat-subheader>&nbsp;&nbsp;Doors/Window</h3>
  <a mat-list-item *ngFor="let c of doors" [routerLink]="['guard', c.key]">
    <div *ngIf="c.status == 'Closed'">
      <mat-icon svgIcon="door_closed"></mat-icon>
    </div>
    <div *ngIf="c.status == 'Open'">
      <mat-icon svgIcon="door_open"></mat-icon>
    </div>
    <h4 mat-line>{{ c.name }}</h4>
    <p mat-line>&nbsp;{{ c.sensor_auth }}</p>
    <p mat-line>&nbsp;</p>
    <p mat-line *ngIf="c.battery == '0' && c.rechargeableBat == true">&nbsp;<strong>OFFLINE</strong></p>
    <p mat-line *ngIf="c.battery == '0'">&nbsp;</p>
    <p *ngIf="c.status == 'Closed'" mat-line>
      <mat-chip-list>
        <mat-chip color="accent" selected>{{ c.status }}</mat-chip>
      </mat-chip-list>
    </p>
    <p *ngIf="c.status == 'Open'" mat-line>
      <mat-chip-list>
        <mat-chip color="primary" selected>{{ c.status }}</mat-chip>
      </mat-chip-list>
    </p>
    <mat-divider></mat-divider>
  </a>
</mat-nav-list>
